const loadGruntTasks = require('load-grunt-tasks')

//swig data
const data = {
  menus: [
    {
      name: 'Home',
      icon: 'aperture',
      link: 'index.html'
    },
    {
      name: 'Features',
      link: 'features.html'
    },
    {
      name: 'About',
      link: 'about.html'
    },
    {
      name: 'Contact',
      link: '#',
      children: [
        {
          name: 'Twitter',
          link: 'https://twitter.com/w_zce'
        },
        {
          name: 'About',
          link: 'https://weibo.com/zceme'
        },
        {
          name: 'divider'
        },
        {
          name: 'About',
          link: 'https://github.com/zce'
        }
      ]
    }
  ],
  pkg: require('./package.json'),
  date: new Date()
}
module.exports = grunt => {
  loadGruntTasks(grunt)  //自动加载grunt插件
  grunt.initConfig({
    //css编译，安装grunt-sass sass插件，src查找所有assets/styles/下面的.scss结尾的样式文件，编译后已.css后缀的文件输出到.tmp目录
    sass: {
      temp: {
        files: [{
          expand: true,
          cwd: 'src',
          src: ['assets/styles/*.scss'],
          dest: '.tmp',
          ext: '.css'
        }]
      }
    },

    //脚本编译，安装grunt-babel @babel/core @babel/preset-env插件，把src/assets/scripts/下面的所有js文件全部编译到main.js并输出到tmp目录
    babel: {
      options: {
        sourceMap: true,
        presets: ['@babel/preset-env']
      },
      temp: {
        files: {
          '.tmp/assets/scripts/main.js': 'src/assets/scripts/*.js'
        }
      }
    },

    //html编译，这里用的是swig模板引擎，安装grunt-swigtemplates插件，默认数据为自定义data数据
    swigtemplates: {
      options: {
        defaultContext: data,
        templatesDir: 'src/'
      },
      temp: {
        dest: '.tmp',
        src: ['src/*.html']
      },
    },

    //将tmp目录下的所有文件复制到dist目录，便于html的css和js的合并压缩处理，安装插件grunt-contrib-copy
    copy: {
      dist: {
          files: [
              {expand: true, cwd: '.tmp/', src : ['**'], dest: 'dist' }
          ]
      }
    },

    // 将dist下所有的html文件中的build开头和endbuild结尾的js和css进行合并且压缩，安装插件grunt-useref grunt-contrib-concat grunt-contrib-uglify grunt-css
    useref: {
      html: 'dist/**/*.html',
      temp: 'dist'
    },

    //监视文件
    watch: {
      css: {
        files: ['src/assets/styles/*.scss'],
        tasks: ['sass'],
        options: {
            livereload: true
        }
      },
      js: {
          files: ['src/assets/scripts/*.js'],
          tasks: ['babel'],
          options: {
              livereload: true
          }
      },
      html: {
          files: ['src/**/*.html', 'dist/*.html'],
          tasks: ['swigtemplates', 'test'],
          options: {
              livereload: true
          }
      },
      dist: {
        files: ['dist/*'],
        options: {
          livereload: true
        }
      }
    },

    //创建服务，安装插件grunt-contrib-connect
    connect: {
      server: {
          options: {
              port: 8000,
              open: true, //自动打开网页 http://
              base: 'dist',
              livereload: true,
          }
      }
    },
  })

  grunt.registerTask('default', ['sass', 'babel', 'swigtemplates', 'copy', 'useref', 'concat', 'uglify', 'cssmin', 'connect', 'watch'])
  // grunt.registerTask('test', ['copy', 'useref', 'concat', 'uglify', 'cssmin']);
  // grunt.registerTask('serve', ['connect', 'watch'])
}